<template>
  <div class="main-box">
    <!-- <i class="iconfont icon-sousuo"></i> -->
    <el-input
      prefix-icon="iconfont icon-sousuo"
      v-model="input"
      placeholder="请输入搜索内容"
      @change="searchProject"
    ></el-input>
  </div>
</template>

<script>
import { getStageProjectListApi } from "@/api/index";
export default {
  data() {
    return {
      input: "",
    };
  },
  methods: {
    searchProject() {
      console.log("搜索框失焦或回车------>", this.input);
      this.searchProject();
    },
    async searchProject() {
      let data = {
        key: this.input,
      };
      let res = await getStageProjectListApi(data);
      console.log("serch----->", data, res);
      if (res.length) {
        this.$parent.active = null;
        this.$parent.showProData = res[0];
      } else {
        this.$message.error("未找到相关项目！请确认搜索条件！");
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.main-box {
  display: flex;
  flex-direction: row;
}
</style>